<template>
    <div class="logoContiner">
        <div slot="tip" class="logo">Logo配置</div>
        <el-upload
            :action="MAIN_URL"
            :headers="requstHeader"
            :http-request="upload"
            :before-upload="beforeUp"
            list-type="picture-card"
            :on-preview="handlePictureCardPreview"
            :on-progress="progress"
            :on-remove="handleRemove"
        >
            <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog :visible.sync="dialogVisible">
            <img width="100%" :src="dialogImageUrl" alt />
        </el-dialog>
    </div>
</template>
<script>
import Axios from "axios";
export default {
    data() {
        return {
            //请求的后端地址(比如：api/admin/....)
            MAIN_URL: "api/admin/flCompanyLogo",
            dialogImageUrl: "",
            dialogVisible: false,
            requstHeader: {
                Authorization: this.$store.state.user.token,
                Accept: "*/*",
                "Accept-Language": "zh-CN,zh;q=0.9,en;q=0.8",
                "X-Requested-With": "XMLHttpRequest",
                "Cache-Control": "no-cache",
                "Content-Type":
                    "multipart/form-data; boundary=----WebKitFormBoundaryCte1eGub1BsCGnbu",
                Pragma: "no-cache",
            },
            imgArr: [],
        };
    },
    methods: {
        beforeUp(file) {
            // console.log('_________________________________')
            // console.log(file)
            var formData = new FormData();
            formData.append("file", file);
            // console.log(formData)
            Axios.post(this.MAIN_URL, formData, { headers: this.requstHeader });
        },
        handleRemove(file, fileList) {
            /* 移除 */
        },
        handlePictureCardPreview(file) {
            /* 预览 */
            this.dialogImageUrl = file.url;
            this.dialogVisible = true;
            Axios.post(this.MAIN_URL, formData, { headers: this.requstHeader });
        },
        progress() {
            console.log("上传中");
        },
        upload(res) {
            //上传成功时的回调
        },
    },
};
</script>
<style lang="scss" scoped>
.logoContiner {
    margin: 55px 15px;
    .logo {
        margin-bottom: 15px;
        font-size: 26px;
    }
}
</style>
